import { locale } from "@/util/locale";
import { propertyUtil } from "../PropertyUtil";
import { BannerItem, InstanceSlotData } from "../types";
import { TagsPaneModel } from "./TagsPaneModel";
import { htmlEditorWindow } from "@/modules/model/modals/htmlEditor";

import { BannerPosition } from "@/constants/Enums";

export class BannerPaneModel {
  activeBannerId: string | null = null;
  constructor(public tagsPaneModel: TagsPaneModel) {}
  /**
   * @param item 每列的点击事件
   */
  handleBannerItemClick(id: string) {
    this.activeBannerId = id;
  }
  /**
   * 将文本转化成可展示数据
   * @param str string
   * @returns
   */
  getDisplayValue(str: string) {
    const data = propertyUtil.stringToBannerInfo(str);
    if (data?.status) {
      return locale.getTByKey(data.status);
    }
  }
  /**
   * 根据选中的值返回选中值的value
   * @returns
   */
  getActiveSlotValue() {
    for (let classifier of this.tagsPaneModel.tableData) {
      for (let slot of classifier.slots) {
        for (let value of slot.values) {
          if (value.id === this.activeBannerId) {
            return value;
          }
        }
      }
    }
  }
  /**
   * 根据选中的值，返回被选中的整列数据
   * @returns
   */
  getActiveSlot() {
    for (let classifier of this.tagsPaneModel.tableData) {
      for (let slot of classifier.slots) {
        for (let value of slot.values) {
          if (value.id === this.activeBannerId) {
            return slot;
          }
        }
      }
    }
  }
  /**
   * 上移选择的id
   */
  async moveUpSlotValue() {
    if (!this.activeBannerId) {
      return;
    }
    const slotValue = this.getActiveSlot();
    if (!slotValue) {
      return;
    }
    const index = slotValue.values.findIndex(it => it.id === this.activeBannerId);
    const data = slotValue.values.splice(index, 1);
    slotValue.values.splice(index - 1, 0, data[0]);
    const values = slotValue.values.map(it => it.value);
    await this.tagsPaneModel.updateSlotValue(slotValue, values);
    // ipcRenderer.send(IpcMsg.BannerChange);
  }
  /**
   * id 下移的id
   */
  async moveDownSlotValue() {
    if (!this.activeBannerId) {
      return;
    }
    const slotValue = this.getActiveSlot();
    if (!slotValue) {
      return;
    }
    const index = slotValue.values.findIndex(it => it.id === this.activeBannerId);
    const data = slotValue.values.splice(index, 1);
    slotValue.values.splice(index + 1, 0, data[0]);
    const values = slotValue.values.map(it => it.value);
    await this.tagsPaneModel.updateSlotValue(slotValue, values);
    // ipcRenderer.send(IpcMsg.BannerChange);
  }
  /**
   * 是否
   */
  isActiveBannerItem(id: string) {
    return id == this.activeBannerId;
  }
  /**
   * 打开编辑上下文
   */
  editSlotValue(data: InstanceSlotData) {
    const item = data.values.find(it => it.id == this.activeBannerId);

    if (!item) {
      return;
    }
    try {
      const bannerItem = JSON.parse(item.value as string) as BannerItem;
      htmlEditorWindow
        .popup({
          projectId: this.tagsPaneModel.tabsModel.projectId,
          text: encodeURIComponent(bannerItem.html),
          modelId: this.tagsPaneModel.tabsModel.data.modelId
        })
        .then(async res => {
          if (res.success) {
            const itemIndex = data.values.findIndex(it => it.id == this.activeBannerId);
            const values = data.values.map(it => it.value);
            const newString = JSON.stringify({
              status: bannerItem.status,
              html: res.value,
              htmlSource: res.htmlSource
            } as BannerItem) as string;
            values.splice(itemIndex, 1, newString);
            await this.tagsPaneModel.updateSlotValue(data, values);
            // ipcRenderer.send(IpcMsg.BannerChange);
          }
        });
    } catch (error) {
      console.error(error);
    }
  }
  async deleteSlotValue(data: InstanceSlotData) {
    const slotValue = this.getActiveSlotValue();
    if (!slotValue) {
      return;
    }
    const values = data.values.filter(it => it.id !== this.activeBannerId).map(it => it.value);
    await this.tagsPaneModel.updateSlotValue(data, values);
    // ipcRenderer.send(IpcMsg.BannerChange);
    this.activeBannerId = null;
  }
  async addSlotValue(data: InstanceSlotData) {
    if (data.values.length >= 100) {
      return;
    }
    const values = data.values.map(item => item.value);
    htmlEditorWindow
      .popup({
        projectId: this.tagsPaneModel.tabsModel.projectId,
        text: "",
        modelId: this.tagsPaneModel.tabsModel.data.modelId
      })
      .then(async res => {
        if (res.success) {
          values.push(
            JSON.stringify({ status: BannerPosition.Header, html: res.value, htmlSource: res.htmlSource } as BannerItem) as string
          );
          await this.tagsPaneModel.updateSlotValue(data, values);
          // ipcRenderer.send(IpcMsg.BannerChange);
        }
      });
  }
}
